import { Tabs, TabPane } from 'vue-bulma-tabs'
import { mapGetters, mapActions } from 'vuex'

import { Modal } from 'vue-bulma-modal'
import Vue from 'vue'
import Message from 'vue-bulma-message'
import page from '../components/page'
import upload from '../components/modifyModel/upload.vue'

const MessageComponent = Vue.extend(Message)

const openMessage = (propsData = {
  title: '',
  message: '',
  type: '',
  direction: '',
  duration: 1500,
  container: '.messages'
}) => {
  return new MessageComponent({
    el: document.createElement('div'),
    propsData
  })
}

const mixin = {
  data () {
    return {
      visible: false,
      list:[],
      param:{},
      id:'',
      classList:[],
      types:{},
      page:{
        page:0,
        size:5,
        sort:[]
      },
      pageData:{
        total:10,
        num:0
      },
    }
  },
  methods: {
    ...mapActions([
      'toggleSidebarls',
      'toggleSidebars',
    ]),
    getClass () {
      let vm = this
      this.$http.get('classification/api/parent/88698031519588352/categories',{page:0,size:100}).then(function(xhr){
        let res = xhr.data.content
        let data = {}
        for(let i = 0; i < res.length; i++){
          data[res[i].id] = res[i].name
        }
        vm.types = data
        vm.classList = res
      })
    },
    _get (url,param,callback) {
      let vm = this
      let params = qs.stringify(param)
      vm.$http.get(url+(url.indexOf('?')>-1?'&':'?')+params,param).then(function(res) {
        vm.list = res.data.content
        vm.page.page = res.data.number
        vm.pageData.total = res.data.totalPages
        vm.pageData.num = res.data.number
        if(callback){
          callback.apply()
        }
      })
    },
    _add (url,param,callback) {
      let vm = this
      this.$http.post(url,param).then(function (res) {
        openMessage({
          title: '提示',
          message: '操作成功',
          type: 'primary'
        })
        if(callback){
          callback.call(this,res.data)
        }
      })
    },
    _modify (url,param,callback) {
      let vm = this
      this.$http.put(url,param).then(function(res){
        openMessage({
          title: '提示',
          message: '修改成功',
          type: 'primary'
        })
        if(callback){
          callback.apply()
        }
      })
    },
    _getModify (url,param,callback) {
      let vm = this
      this.$http.get(url,param).then(function(res){
        for(let key in vm.param){
          vm.param[key] = res.data[key]
        }
        if(callback){
          callback.apply(this,[res])
        }
      })
    },
    _delete(url,param,callback){
      let vm = this
      this.$parent.$parent.toasts('确认是否删除?',function(){vm._deletes(url,param,callback)})
    },
    getMap (data) {
      this.param[data.ids] = data.url
    },
    _deletes (url,param,callback) {
      let vm = this
      this.$http.delete(url,param).then(function(res){
        openMessage({
          title: '提示',
          message: '删除成功',
          type: 'primary'
        })
        if(callback){
          callback.apply()
        }
      })
    }
  },
  computed:  mapGetters({
    sidebar: 'sidebar',
    sidebarl: 'sidebarl',
  }),
  components: { Tabs, TabPane, Modal, page, upload},
  mounted () {
    this.toggleSidebars(false)
    this.toggleSidebarls(true)
    this.$parent.$parent.$refs.nav.status = false
  }
}

export default mixin
